<template>
	<div class="app-container">
		<!-- 高级查询 -->
		<el-form v-show="searchVisible" ref="queryForm" :model="queryParams" :inline="true">
			<el-form-item label="库架区域">
				<el-select v-model="queryParams.locationType" clearable placeholder="请选择库架区域">
					<el-option v-for="item in  options.locationTypes" :key="item.key" :label="item.label"
						:value="item.key">
					</el-option>
				</el-select>
			</el-form-item>
			<el-form-item label="库架编号">
				<el-input v-model="queryParams.locationNo" size="small" placeholder="请输入库架编号" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item>
			
			<!-- <el-form-item label="物品编号">
				<el-input v-model="queryParams.materialNo" size="small" placeholder="请输入" clearable
					@keyup.enter.native="handleQuery" />
			</el-form-item> -->

			<el-form-item>
				<el-button type="cyan" icon="el-icon-search" size="mini" @click="handleQuery">查询</el-button>
				<el-button icon="el-icon-refresh" size="mini" @click="resetQuery">重置</el-button>
			</el-form-item>
		</el-form>

		<!-- 工具栏 -->
		<!-- <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button v-hasPermission="['web:tbWmsMaterialInLocation:insert']" type="primary" icon="el-icon-plus" size="mini" @click="handleAdd">新增</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button v-hasPermission="['web:tbWmsMaterialInLocation:update']" type="success" icon="el-icon-edit" size="mini" :disabled="isSingle" @click="handleEdit">修改</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button v-hasPermission="['web:tbWmsMaterialInLocation:delete']" type="danger" icon="el-icon-delete" size="mini" :disabled="isMultiple" @click="handleRemove">删除</el-button>
      </el-col>
      <el-col :span="1.5">
        <el-button v-hasPermission="['web:tbWmsMaterialInLocation:export']" type="warning" icon="el-icon-download" size="mini" @click="handleExport">导出</el-button>
      </el-col>
      <right-toolbar :show-search.sync="searchVisible" @queryTable="handleQuery" />
    </el-row> -->

		<!-- 数据列表 -->
		<el-table v-loading="loading" :data="page.records" highlight-current-row
			@selection-change="handleSelectionChange">
			<el-table-column type="selection" width="55" align="center" />
			<el-table-column label="序号" type="index" width="55" align="center" />
			<!-- <el-table-column label="区域编码" align="center" prop="warehouseCode" /> -->
			<el-table-column label="库架编号" align="center" prop="locationNo" />
			<el-table-column label="库架名称" align="center">
				<template slot-scope="scope">
					<span>{{ scope.row.qrCodeValue.slice(14)}}</span>
				</template>
			</el-table-column>
			<el-table-column label="库架区域" align="center" prop="area" />
			<!-- 	<el-table-column label="物品编号" align="center" prop="materialNo" width="250" />
 -->
			<!-- <el-table-column label="数量" align="center" prop="quantity" /> -->
			<!--      <el-table-column label="有效期至" align="center" prop="validityDate" width="180">-->
			<!--        <template slot-scope="scope">-->
			<!--          <span>{{ parseTime(scope.row.validityDate, '{y}-{m}-{d}') }}</span>-->
			<!--        </template>-->
			<!--      </el-table-column>-->

			<!--      <el-table-column label="盘点号" align="center" prop="checkNo" width="180"/>-->
			<!-- <el-table-column label="排" align="center" prop="lotNo" />
      <el-table-column label="层" align="center" prop="cellNo" />
      <el-table-column label="格" align="center" prop="cellNo" /> -->

			<!--      <el-table-column label="创建时间" align="center" prop="createTime" width="180">-->
			<!--        <template slot-scope="scope">-->
			<!--          <span>{{ parseTime(scope.row.createTime, '{y}-{m}-{d}') }}</span>-->
			<!--        </template>-->
			<!--      </el-table-column>-->
			<el-table-column label="操作" align="center" fixed="right" class-name="small-padding fixed-width">
				<template slot-scope="scope">
					<el-button v-hasPermission="['web:tbWmsMaterialInLocation:update']" size="mini" type="text"
						icon="el-icon-edit" @click="handleInWareHouse(scope.row)">存件</el-button>
					<el-button v-hasPermission="['web:tbWmsMaterialInLocation:delete']" size="mini" type="text"
						icon="el-icon-delete" @click="handleOutWareHouse(scope.row)">取件</el-button>
				</template>
			</el-table-column>
		</el-table>

		<!-- 分页 -->
		<pagination v-show="page.total>0" :total="page.total" :page.sync="page.current" :limit.sync="page.pageSize"
			@pagination="handleQuery" />

		<!-- 添加/修改对话框 -->
		<el-dialog :title="callAvgDepositDialog.title" :visible.sync="callAvgDepositDialog.visible" width="400px"
			append-to-body>
			<div>

				<el-input v-model="avgService.strMovTwo" placeholder="放货点" />
				<el-select v-model="avgService.strMovOne" style="width: 100%;margin:10px 0;" filterable clearable
					placeholder="请选择取货点">
					<el-option v-for="option in options.fetchLocOptions" :key="option.key" :label="option.label"
						:value="option.key" />
				</el-select>
				<div slot="footer" class="dialog-footer" style="text-align:center">
					<el-button type="primary" @click="confirmDepositDialog">确 定</el-button>
					<el-button @click="resetUploadDialog">取 消</el-button>
				</div>
			</div>
		</el-dialog>
		<el-dialog :title="callAvgFetchDialog.title" :visible.sync="callAvgFetchDialog.visible" width="400px"
			append-to-body>
			<div>

				<el-input v-model="avgService_one.strMovOne" placeholder="取货点" />


				<el-select v-model="avgService_one.strMovTwo" style="width: 100%;margin:10px 0;" filterable clearable
					placeholder="放货点">
					<el-option v-for="option in options.depositLocOptions" :key="option.key" :label="option.label"
						:value="option.key" />
				</el-select>



				<div slot="footer" class="dialog-footer" style="text-align:center">
					<el-button type="primary" @click="confirmFetchDialog">确 定</el-button>
					<el-button @click="resetUploadDialog">取 消</el-button>
				</div>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import TbWmsLocationApi from '@/api/web/TbWmsLocationApi'
	import appConstant from '@/constant/AppConstant'
	const defaultTbWmsMaterialInLocationFormData = {
		siteCode: null,
		warehouseCode: null,
		locationNo: null,
		materialNo: null,
		customerNo: null,
		batchNo: null,
		quantity: null,
		validityDate: null,
		version: null,
		checkNo: null,
		lotNo: null,
		cellNo: null,
		customerId: null,
	}
	export default {
		name: 'TbWmsMaterialInLocationList',
		data() {
			return {
				options: {
					sysYnTypeOptions: this.$constant.sysYnTypeOptions,
					fetchLocOptions: appConstant.depositLocOptions,
					depositLocOptions: appConstant.depositLocOptions,
					locationTypes: this.$constant.locationTypes
				},
				queryParams: {
					siteCode: null,
					locationType: '',
					warehouseCode: null,
					locationNo: null,
					materialNo: null,
					customerNo: null,
					batchNo: null,
					quantity: null,
					validityDate: null,
					version: null,
					checkNo: null,
					lotNo: null,
					cellNo: null,
					customerId: null,
					isValid: this.$constant.Y
				},
				callAvgFetchDialog: {
					title: '取货',
					visible: false
				},
				callAvgDepositDialog: {
					title: '放货',
					visible: false
				},
				avgService: {
					strMovTwo: null,
					strMovOne: null
				},
				avgService_one: {
					strMovTwo: null,
					strMovOne: null
				},
				page: {
					current: 1,
					pageSize: 10,
					total: 0,
					records: []
				},
				tbWmsMaterialInLocationFormDialog: {
					title: '',
					visible: false
				},
				tbWmsMaterialInLocationFormData: Object.assign({}, defaultTbWmsMaterialInLocationFormData),
				tbWmsMaterialInLocationFormRules: {
					siteCode: [{
						required: true,
						message: '不能为空',
						trigger: 'blur'
					}],
					warehouseCode: [{
						required: true,
						message: '不能为空',
						trigger: 'blur'
					}],
					locationNo: [{
						required: true,
						message: '不能为空',
						trigger: 'blur'
					}],
					materialNo: [{
						required: true,
						message: '不能为空',
						trigger: 'blur'
					}],
					customerNo: [{
						required: true,
						message: '不能为空',
						trigger: 'blur'
					}],
					quantity: [{
						required: true,
						message: '不能为空',
						trigger: 'blur'
					}],
					version: [{
						required: true,
						message: '不能为空',
						trigger: 'blur'
					}],
				},
				loading: true,
				searchVisible: true,
				multipleSelection: [],
				isSingle: true,
				isMultiple: true
			}
		},
		created() {
			this.handleQuery()
			this.loadOptions()
		},
		methods: {
			loadOptions() {

			},
			handleAdd() {
				this.openTbWmsMaterialInLocationFormDialog()
			},
			resetUploadDialog() {
				this.callAvgDepositDialog.visible = false
				this.callAvgFetchDialog.visible = false
			},
			confirmDepositDialog() {
				TbWmsLocationApi.inWareHouseHavy(this.avgService).then(response => {
					this.$message.success('叉车调用成功')
					this.callAvgDepositDialog.visible = false

				})
			},
			confirmFetchDialog() {
				TbWmsLocationApi.outWareHouseHavy(this.avgService_one).then(response => {
					this.$message.success('叉车调用成功')
					this.callAvgFetchDialog.visible = false

				})
			},

			openCallAvgDepositDialog(ids) {

				this.callAvgDepositDialog.visible = true
				this.avgService.strMovTwo = ids

			},
			openCallAvgFetchDialog(ids) {

				this.callAvgFetchDialog.visible = true
				this.avgService_one.strMovOne = ids

			},
			handleInWareHouse(row) {
				const ids = row.locationNo
				this.$confirm('是否确认存件？', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					if (row.area == '重型物品区') {
						this.openCallAvgDepositDialog(ids)
					} else {
						TbWmsLocationApi.inWareHouse(ids)
					}
				}).catch(() => {
					this.handleQuery()
					this.$message.success('取消成功')
				})
			},
			handleOutWareHouse(row) {
				const ids = row.locationNo
				this.$confirm('是否确认取件?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					if (row.area == '重型物品区') {
						this.openCallAvgFetchDialog(ids)
						//	return TbWmsLocationApi.outWareHouseHavy(ids)
					} else {
						TbWmsLocationApi.outWareHouse(ids)
					}
				}).catch(() => {
					this.handleQuery()
					this.$message.success('取消成功')
				})
			},
			handleRemove(row) {
				const ids = row.id || this.multipleSelection.map(item => item.id)
				this.$confirm('是否确认删除数据?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(function() {
					return TbWmsMaterialInLocationApi.remove(ids)
				}).then(() => {
					this.handleQuery()
					this.$message.success('删除成功')
				})
			},
			handleEdit(row) {
				const id = row.id || this.multipleSelection.map(item => item.id)[0]
				this.openTbWmsMaterialInLocationFormDialog(id)
			},
			handleQuery() {
				this.loading = true
				TbWmsLocationApi.page(this.queryParams, this.page).then(response => {
					this.page.records = response.data.records
					this.page.total = response.data.total
					this.loading = false
				}, () => {
					this.loading = false
				})
			},
			handleExport() {
				this.$confirm('是否确认导出数据?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(function() {
					return TbWmsMaterialInLocationApi.exportData(this.queryParams)
				}).then(response => {
					this.$common.download(response.msg)
				})
			},
			openTbWmsMaterialInLocationFormDialog(id) {
				this.resetTbWmsMaterialInLocationFormDialog()
				this.tbWmsMaterialInLocationFormDialog.visible = true
				if (id) {
					this.tbWmsMaterialInLocationFormDialog.title = '货区货物清单-修改'
					TbWmsMaterialInLocationApi.get(id).then(response => {
						this.tbWmsMaterialInLocationFormData = {
							...this.tbWmsMaterialInLocationFormData,
							...response.data
						}
					})
				} else {
					this.tbWmsMaterialInLocationFormDialog.title = '货区货物清单-添加'
				}
			},
			confirmTbWmsMaterialInLocationFormDialog() {
				this.$refs['tbWmsMaterialInLocationForm'].validate(valid => {
					if (valid) {
						if (this.tbWmsMaterialInLocationFormData.id) {
							TbWmsMaterialInLocationApi.edit(this.tbWmsMaterialInLocationFormData).then(
								response => {
									this.$message.success('修改成功')
									this.tbWmsMaterialInLocationFormDialog.visible = false
									this.handleQuery()
								})
						} else {
							TbWmsMaterialInLocationApi.add(this.tbWmsMaterialInLocationFormData).then(response => {
								this.$message.success('添加成功')
								this.tbWmsMaterialInLocationFormDialog.visible = false
								this.handleQuery()
							})
						}
					}
				})
			},
			resetTbWmsMaterialInLocationFormDialog() {
				this.tbWmsMaterialInLocationFormDialog = {
					title: '',
					visible: false
				}
				this.tbWmsMaterialInLocationFormData = Object.assign({}, defaultTbWmsMaterialInLocationFormData)
				this.resetForm('tbWmsMaterialInLocationForm')
			},
			handleSelectionChange(selection) {
				this.multipleSelection = selection
				this.isSingle = selection.length !== 1
				this.isMultiple = !selection.length
			},
			resetQuery() {
				this.page.current = 1
				this.queryParams.locationNo = ''
				this.queryParams.locationType = ''
				this.handleQuery()
			}
		}
	}
</script>
